import React, { memo, useEffect } from "react";
import propTypes from "prop-types";
import { message, Skeleton } from "antd";
const Auth = memo((props) => {
  const { flag, to, showModal } = props;
  useEffect(() => {
    if (!flag) {
      message.loading("请先登录，再看每日推荐", 2).then(() => {
        to();
        showModal();
      });
    }
  }, [to, showModal, flag]);
  return (
    <div style={{ display: flag ? "none" : "block" }}>
      <Skeleton active />
    </div>
  );
});

Auth.propTypes = {
  flag: propTypes.bool.isRequired,
};

export default Auth;
